<template>
	<div class="lietou-detail content">
		<div class="detail-bg"></div>
		<div class="lietou-right">
			<breadcrumb id="breadcrumb-container" class="breadcrumb-container" />
			
			<div class="lietou-detail-head">
				<h2 class="lietou-detail-h1">职位信息</h2>
				<div class="acount">
					<p class="detail-msg">
						<span class="tag-name">职位标题:</span>
						<span class="tag-value">{{position.cj_name}}</span>
					</p>
					<p class="detail-msg">
						<span class="tag-name">招聘公司:</span>
						<span class="tag-value">{{position.cname}}</span>
					</p>
					<p class="detail-msg">
						<span class="tag-name">招聘职位:</span>
						<span class="tag-value">{{position.jname}}</span>
					</p>
					<p class="detail-msg">
						<span class="tag-name">工作地点:</span>
						<span class="tag-value">{{position.work_address}}</span>
					</p>
					<!-- <p class="detail-msg">
						<span class="tag-name">是否面试:</span>
						<span class="tag-value">{{position.cj_name}}</span>
					</p> -->
					<!-- <p class="detail-msg">
						<span class="tag-name">面试地址:</span>
						<span class="tag-value">{{position.mianshi_address}}</span>
					</p> -->
					<p class="detail-msg">
						<span class="tag-name">职位薪资:</span>
						<span class="tag-value">{{position.cj_money}}元</span>
					</p>
					<p class="detail-msg">
						<span class="tag-name">招聘意向:</span>
						<span class="tag-value">{{position.worktype==1?'长期工':position.worktype==2?'临时工':'均可'}}</span>
					</p>
					<p class="detail-msg">
						<span class="tag-name">招聘人数:</span>
						<span class="tag-value">{{position.num_max}}人</span>
					</p>
					<p class="detail-msg">
						<span class="tag-name">猎聘奖励:</span>
						<span class="tag-value">{{position.reward_money}}元/人</span>
					</p>
				</div>
			</div>
		</div>
	</div>
</template>

<script>
	import { mapGetters } from 'vuex'
	import Breadcrumb from '@/components/Breadcrumb'
	export default {
		name: 'CompanyDetail',
		components:{
			Breadcrumb
		},
		computed: {
			...mapGetters([
				'token'
			])
		},
		data() {
			return {
				position:[],
				detailId:''
			}
		},
		async created() {
			this.detailId = this.$route.query.id;
			this.loadData();
		},
		methods:{
			async loadData() {
			  const loading = this.$loading({
				 lock: true,
				 text: 'Loading',
				 spinner: 'el-icon-loading',
				 background: 'rgba(0, 0, 0, 0.5)'
			  });
			  try {
				 let res = await this.$http({
					url: '/man/Job/getInfo',
					method: 'post',
					params: {
						"token": this.token,
						"id": this.detailId
					}
				 });
				 this.position = res.data; 
				 loading.close();
			  } catch (e) {
				 console.log(e)
				 loading.close();
			  }
			},
			
		}
	}
</script>

<style lang="scss" scoped="scoped">
	.lietou-detail{
		// background-color: #f4f4f4;
		background-color: rgb(240, 242, 245);
		position: relative;
		
		.detail-bg {
		  position: fixed;
		  top: 0px;
		  left: 0;
		  bottom:0;
		  right: 0;
		  background: #f4f4f4;
		}
		
	}
	.lietou-detail-head{
		background-color: #fff;
		margin:0 0 20px 0px;
		padding-bottom:25px;
		position: relative;
		min-width:800px;
		
		.lietou-detail-h1{
			font-size:18px;
			font-weight: bold;
			padding:20px 16px 8px;
		}
		.acount{
			margin:0 34px 12px;
			line-height: 26px;
			.tag-name{
				margin-right:20px;
			}
			
		}
	}
</style>
